<template>
  <el-menu
    class="el-menu-vertical-demo"
    background-color="#324157"
    text-color="#fff"
    active-text-color="#20A0FF"
    >

    <el-menu-item index="1" @click="jump('/SearchSurplus')">
      <i class="el-icon-user-solid"></i>
      <span slot="title">查询余额</span>
    </el-menu-item>
    <el-menu-item index="2" @click="jump('/TransferAccounts')">
      <i class="el-icon-top-right"></i>
      <span slot="title">转账</span>
    </el-menu-item>
    <el-menu-item index="3" @click="jump('/SearchHistory')">
      <i class="el-icon-pie-chart"></i>
      <span slot="title">查询交易记录</span>
    </el-menu-item>
    <el-menu-item index="4" @click="jump('/UpdatePassword')">
      <i class="el-icon-edit-outline"></i>
      <span slot="title">修改密码</span>
    </el-menu-item>

  </el-menu>
</template>

<script>
export default {
  name: "Side",
  methods: {
    jump(path) {
      this.$router.push(path)
    }
  }
}
</script>

<style scoped>
.el-menu-vertical-demo {
  background-color: rgb(50, 65, 87);
}
</style>
